<template>
  <div style="padding: 2rem 1rem;">
    <p class="font_s36 textC colorF title">待售墓穴信息</p>
    <ul class="flex textC colorF font_s20 dailyInspect_title JustifyContentC">
      <li class="flex2">公墓名称</li>
      <li class="flex2">墓区（室）名称</li>
      <li class="flex2">待售墓穴（格位）类型</li>
      <li class="flex2">待售墓穴（格位）数量（套）</li>
      <li class="flex2">价格区间（元）</li>
      <li class="flex2">墓穴（格位）面积（平方米）</li>
      <li class="flex1">备注</li>
    </ul>
    <div class="superviseList font_s18 " style="height: 70vh;margin: 0px 0rem 0rem;">
      <ul class="flex textC colorF font_s18 dailyInspect_content JustifyContentC" v-for="(item, index) in dataList" v-bind:key="index">
        <li class="flex2">{{item.orgName}}</li>
        <li class="flex2">{{item.graveZoneName}}</li>
        <li class="flex2">{{item.nosoldGraveType}}</li>
        <li class="flex2">{{item.nosoldGraveCount}}</li>
        <li class="flex2">{{item.priceRange}}</li>
        <li class="flex2">{{item.nosoldGraveAreaStr}}</li>
        <li class="flex1">{{item.memo}}</li>
      </ul>
    </div>
  </div>
</template>
<script>
export default {
  name: 'TombsSale',
  props: {
    dataList: {
      type: Array,
      default: () => {
        return []
      }
    }
  }
}
</script>
<style scoped>
  .title {
    line-height: 4rem;
  }
  .dailyInspect_title {
    background:#4ca5ab;
    border-radius: 10px 10px 0 0;
    line-height: 2.5rem;
  }
  .dailyInspect_content {
    background: #27515f;
    line-height: 3.625rem;
    margin: 0.825rem 0;
    border-radius: 5px;
  }
  .superviseList {
    overflow-x: hidden;
    overflow-y: auto
  }
  ::-webkit-scrollbar {
    width: 0 !important;
  }
  ::-webkit-scrollbar {
    width: 0 !important;height: 0;
  }
</style>
